<template>
  <el-dialog title="提示" :visible.sync="showModifyMenu" width="570px">
    <el-transfer v-model="selectedMenuList" :data="menuData" :titles="['待选菜单', '已选菜单']"></el-transfer>
    <span slot="footer" class="dialog-footer">
      <el-button @click="showModifyMenu = false">取 消</el-button>
      <el-button type="primary" @click="onModifyMenu">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
import { mapActions } from "vuex"
export default {
  mounted() {

    this.getMenuList().then(res => {

      this.menuList = res
      this.menuList.forEach((menu, index) => {
       console.log(menu.id)
        this.data.push({
          label: menu.menuTitle,
          key: menu.id
        });
      })
      this.menuData = this.data
    })

    
   
  },
  data() {

    return {
      data: [],
      menuData: [],
      showModifyMenu: false,
      menuList: [],
      selectedMenuList: [],
      tempData: {},


    }
  },
  methods: {
    ...mapActions('pms/menu.rule', ['menuRuleUpdate']),
    ...mapActions('pms/sys.menu', ['getMenuList']),
    showDialog(data = {}) {

      this.tempData = data
      //将菜单Dialog显示出来
      this.showModifyMenu = true
    },
    onModifyMenu() {
      //在用户修改了菜单之后执行
      
      this.showModifyMenu = false;

      console.log(this.selectedMenuList);
      console.log(this.currentModifyMenuRow);
    },

  }
}
</script>